<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<HEAD>
     <TITLE>About Table Properties</TITLE>
     <link rel="stylesheet" type="text/css" href="../../ss/2.css" id="thecss">
     <script type="text/javascript" src="../../scripts/csschange.js"></script>
</HEAD>

<BODY onload="readSS()">

<br>
<h1 align="center"><span class="pagetitle">About Table Properties</span><br>
<font size=2>= <span class="sitetitle">Index DOT Css</span> by <a 
href="../../misc/email.htm">Brian Wilson</a> =</font></h1>

<div align="center">
<table border=3 cellpadding=5 cellspacing=0>
<tr>
    <td>&#160;&#160;<font size=2><a href="../index.html">Main Index</a> |
    <a href="../propindex/font.htm">Property Index</a> |
    <a href="../supportkey/syntax.htm">CSS Support History</a> |
    <a href="../../history/browsers.htm">Browser History</a></font>&#160;&#160;</td>
</tr>
</table>
</div>
<br><br>

<dl>
<dt><big><b class="mainheading">Table Properties</b></big>
    <dd><a href="../properties/table/bcollapse.htm">border-collapse</a> |
        <a href="../properties/table/bspace.htm">border-spacing</a> |
        <a href="../properties/table/capside.htm">caption-side</a> |
        <a href="../properties/table/emptycell.htm">empty-cells</a> |
        <a href="../properties/table/speakhead.htm">speak-header</a> |
        <a href="../properties/table/tlayout.htm">table-layout</a>
</dl>

<br>
<dl>
<dt><big><b class="mainheading">What Do They Do?</b></big>
    <dd>The very first sentence in the CSS2 specification section on Tables
        is succinct and to the point about the purpose of tables, and it
        bears repeating: "Tables represent relationships between data."
        <br><br>

        These relationships, along with the CSS properties that control them,
        are primarily conveyed visually, but CSS2 also allows for properties
        that describe how table header and data cells are rendered aurally.
        <br><br>

        In rendering tables visually, data is divided into cells, which are
        grouped into rows, columns and groups of rows and columns. Common
        visual rendering aids for representing data relationships in tables
        include borders around and alignment within cells.
</dl>

<dl>
<dt><big><b class="mainheading">CSS2 Tables and HTML 4.0 Tables</b></big>
    <dd>CSS1 did not contain any properties specifically for tables, but CSS2
        changes that. New values for the 'display' property allow elements to
        be described in the manner consistent with the HTML 4.0 table model,
        which has a well-defined and documented behavior and structure.
        Elements may now be assigned or re-assigned a display value
        equivalent to elements in the HTML 4.0 table model.
</dl>

<dl>
<dt><big><b class="mainheading">CSS2 'display' Values Mapping To<br>HTML 4.0 Element Functionality</b></big>
<dd>
<table border=2 cellspacing=0 cellpadding=2>
<tr><th align="left"><b class="subheading">'Display'<br>Property Value</b></th>
    <td rowspan=11 bgcolor="#808080">&nbsp;&nbsp;</td>
    <th align="left" valign="bottom"><b class="subheading">HTML&nbsp;4 Table Element</b></th></tr>
<tr><td>'table'</td>
    <td><a href="http://www.blooberry.com/indexdot/html/tagpages/t/table.htm">TABLE</a>
        <span class="external">[--&gt;Index DOT Html]</span></td></tr>
<tr><td>'table-caption'</td>
    <td><a href="http://www.blooberry.com/indexdot/html/tagpages/c/caption.htm">CAPTION</a>
        <span class="external">[--&gt;Index DOT Html]</span></td></tr>
<tr><td>'table-header-group'</td>
    <td><a href="http://www.blooberry.com/indexdot/html/tagpages/t/thead.htm">THEAD</a>
        <span class="external">[--&gt;Index DOT Html]</span></td></tr>
<tr><td>'table-row-group'</td>
    <td><a href="http://www.blooberry.com/indexdot/html/tagpages/t/tbody.htm">TBODY</a>
        <span class="external">[--&gt;Index DOT Html]</span></td></tr>
<tr><td>'table-footer-group'</td>
    <td><a href="http://www.blooberry.com/indexdot/html/tagpages/t/tfoot.htm">TFOOT</a>
        <span class="external">[--&gt;Index DOT Html]</span></td></tr>
<tr><td>'table-column'</td>
    <td><a href="http://www.blooberry.com/indexdot/html/tagpages/c/col.htm">COL</a>
        <span class="external">[--&gt;Index DOT Html]</span></td></tr>
<tr><td>'table-column-group'</td>
    <td><a href="http://www.blooberry.com/indexdot/html/tagpages/c/colgroup.htm">COLGROUP</a>
        <span class="external">[--&gt;Index DOT Html]</span></td></tr>
<tr><td>'table-row'</td>
    <td><a href="http://www.blooberry.com/indexdot/html/tagpages/t/tr.htm">TR</a>
        <span class="external">[--&gt;Index DOT Html]</span></td></tr>
<tr><td>'table-cell'</td>
    <td><a href="http://www.blooberry.com/indexdot/html/tagpages/t/thtd.htm">TH|TD</a>
        <span class="external">[--&gt;Index DOT Html]</span></td></tr>
<tr><td>'inline-table'</td><td>NA</td></tr>
</table>
</dl>

<dl>
<dt><big><b class="mainheading">Related Sites</b></big>
<dt><b class="subheading">Official Reference: CSS Level 2, Section 17.4-7</b>
    <dd>17.6: '<a href="http://www.w3.org/TR/REC-CSS2/tables.html#borders">border-collapse</a>'<br>
        17.6.1: '<a href="http://www.w3.org/TR/REC-CSS2/tables.html#separated-borders">border-spacing</a>'<br>
        17.4.1: '<a href="http://www.w3.org/TR/REC-CSS2/tables.html#q6">caption-side</a>'<br>
        17.6.1: '<a href="http://www.w3.org/TR/REC-CSS2/tables.html#empty-cells">empty-cells</a>'<br>
        17.7.1: '<a href="http://www.w3.org/TR/REC-CSS2/tables.html#speak-headers">speak-header</a>'<br>
        17.5.2: '<a href="http://www.w3.org/TR/REC-CSS2/tables.html#width-layout">table-layout</a>'
<dt><b class="subheading">Browser Reference: Microsoft MSDN</b>
    <dd>'<a href="http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/bordercollapse.asp">border-collapse</a>'<br>
        '<a href="http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/tablelayout.asp">table-layout</a>'
</dl>

<br><br>
<a href="../../misc/copyright.htm">Boring Copyright Stuff....</a>
<br>

</BODY>
</HTML>